<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title></title>
	<style>
		*{
			margin:0;
			padding:0;
		}
		body{
			font-family:"微软雅黑";
			background-color:#ffffff;
		}
	</style>
	<link rel="stylesheet" href="js/plugIn/layui-master/src/css/layui.css">
	<style>/*在layui样式之后覆盖layui的样式*/
		.layui-table-cell{
			/*text-align:center;*/
			height: auto;
			white-space: normal;
		}
		.layui-table-view {
			margin: 0px 0px;
		}
	</style>
	<script src="js/plugIn/jquery/jquery.min.js"></script><!--jquery 要在layui之前，这样layui就不会加载内部的jquery-->
	<script src="js/plugIn/layui-master/src/layui.js"></script>

	<script src="js/common/tool.js"></script>
	<script src="config/InitConfig.js"></script>

</head>

<body>



<table class="layui-hide" id="stateList" lay-filter="stateList"></table>

	<div style="text-align:center;margin-top: 20px">
		<input type="button" onclick="okClick()" class="layui-btn" value="确定"/>
	</div>

<!--数据点选择下拉列表-->
<script type="text/html" id="device_condition_Select">
	<input  type="text" placeholder="点击选择数据点"  style="cursor:pointer"  readOnly="readOnly"  value="{{d.devicecode==''?'':d.devicename+'-'+d.devicecode}}" name="device_condition_Select_select" autocomplete="off"  class="layui-input"  />
</script>
</body>
<script type="text/html" id="operateButton">
	<button type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="deleteButton">删除</button>
</script>

<script>
var table_data= new Array();
if(parent.conditionConfig==""){
	parent.conditionConfig={};
}else{

	var condition =parent.conditionConfig;// 不知道为什么直接放到表格里面不会显示 , 用下面的循环转一次才可以
	for(var i=0;i<condition.length;i++){
		var whereObj_t = condition[i];
		var obj_t={};
		obj_t.devicecode=whereObj_t.devicecode;
		obj_t.devicename=whereObj_t.devicename;
		obj_t.min=whereObj_t.min;
		obj_t.max=whereObj_t.max;
		obj_t.urlContent=whereObj_t.urlContent;
		obj_t.contentWidth=whereObj_t.contentWidth;
		obj_t.contentHeight=whereObj_t.contentHeight;
		obj_t.time=whereObj_t.time;//弹框自动关闭时间，0 不自动关闭
		table_data.push(obj_t);

	}


}


var index = parent.layer.getFrameIndex(window.name);
var hardware_id="";//当前选择的硬件传感器数据点的id
var hardware_Text="";//当前选择的硬件传感器数据点的描述





var table;
	layui.use(['form','element','table'], function(){
		table = layui.table;
		table.render({
			 elem: '#stateList'
			,toolbar:'<div style="float: left">条件列表<span style="font-size:12px;color:red"></span></div>'
			,defaultToolbar: [{ //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
				title: '添加条件'
				,layEvent: 'addWhere'
				,icon: 'layui-icon-add-1'
			}]
			,data:table_data
			,cellMinWidth: 80
			,even:true
			,page:false
			,limit: Number.MAX_VALUE // 数据表格默认全部显示
			,height: 'full-80'
			,cols: [[
				{field:'device_Select',align:'center', width:150, title: '选择数据点', templet: '#device_condition_Select'}
				,{field:'min',align:'center',  width:80, title: '>=',edit:'text'}
				,{field:'max',align:'center',  width:80, title: '<=',edit:'text'}
				,{field:'urlContent',  title: '弹框url',edit:'text'}
				,{field:'contentWidth',align:'center', width:90 , title: '弹框宽度',edit:'text'}
				,{field:'contentHeight',align:'center', width:90,  title:'弹框高度',edit:'text'}
				,{field:'time',align:'center', width:90,  title:'弹框自动关闭时间（s）<span style="color:#ff0000">0:不自动关闭</span>',edit:'text'}
				,{title: '操作',align:'center' , width:80,toolbar: '#operateButton'}
			]]
			,done: function(res, curr, count){
				//这是监听数据点文本框的改变
				$("input[name='device_condition_Select_select']").bind("click",function(){
					var current_input = $(this);
					var input_value = $(this).val();// 当前文本框的值
					//测试操作代码
					//alert($(this).val());
					var $selectedvalue = $(this).val();
					layer.open({
						title:'请选择需要绑定的数据点',
						type: 2,
						area: ['452px', '584px'],
						fixed: false, //不固定
						maxmin: true,
						content: 'hardwareSelect.html?hardware_id='+input_value.split("-")[1],
						end: function(index, layero){
							//   var hardware_id="";//当前选择的硬件传感器数据点的id
							//    var hardware_Text="";//当前选择的硬件传感器数据点的描述

							if(hardware_id!==''){
								current_input.val(hardware_Text+"-"+hardware_id);

								var selectElem = current_input;
								var tdElem = selectElem.closest("td");
								var trElem = tdElem.closest("tr");
								var tableView = trElem.closest(".layui-table-view");
								var jyzt_lay_id = tableView.attr("lay-id");//layui表格的id
								table.cache[tableView.attr("lay-id")][trElem.data("index")]['devicecode'] = hardware_id;
								table.cache[tableView.attr("lay-id")][trElem.data("index")]['devicename'] = hardware_Text;
								hardware_id="";
								hardware_Text="";
							}

						}

					});

				});
			}
		});

		//监听行工具事件
		table.on('tool(stateList)', function(obj){
			if(obj.event === 'deleteButton'){
				layer.confirm('真的删除行么', function(index){
					var trElem = obj.tr;
					var tableView = trElem.closest(".layui-table-view");
					var t_data = table.cache[tableView.attr("lay-id")];
					if (obj.tr.data('index') >= 0) {
						t_data.splice(obj.tr.data('index'), 1)//根据索引删除当前行
						table.reload(tableView.attr("lay-id"), {data:t_data});
					}



					layer.close(index);
				});
			}
		});
		//头工具栏事件
		table.on('toolbar(stateList)', function(obj){
			switch(obj.event){
				case 'addWhere':

					var tjzt_data =table.cache["stateList"];
					tjzt_data.push({
						devicecode:"",
						devicename:"",
						min:"",
						max:"",
						urlContent:"http://",
						contentWidth:"800",
						contentHeight:"600",
						time:0
					});
					table.reload('stateList', {data:tjzt_data});
					break;
			};





		});








	});

//点击确认按钮
function okClick(){
	conditionContent=table.cache['stateList'];//表格数据
	parent.conditionConfig=conditionContent;
	parent.layer.close(index);
}
</script>
</html>

